<template>
    <div class="row">
            <div v-for="(result,index) in results" :key="index" class="col-md-4" @click="gotoHouse(result.id)">
                <div class="row justify-content-center">
                    <b-img thumbnail style="width:100%" :src="result.photos?BASE_URL +  result.photos[0]:BASE_URL +'/photos/base.jpg'"></b-img>
                </div>
                <div class="row justify-content-center mb-3">
                    <strong>
                        {{ result.title+Array(41-result.title.length).join("&#160;")}}
                    </strong>
                </div>
                <div class="row justify-content-center mb-3">
                    <p style="text-align:left">
                        {{result.layout}}|{{result.area}}㎡|{{result.floor}}层
                    </p>
                </div>
                <div class="row justify-content-center mb-3">
                    <p>{{result.address.substr(0,12)}}</p>
                </div>
                <div class="row justify-content-center mb-3">
                    <p>{{result.price}}</p>
                </div>
                <div class="row justify-content-center mb-3">
                    <badge class="mt-1 mr-1" type="primary">{{result.tags[0]?result.tags[0]:"sb"}}</badge>
                    <badge class="mt-1 mr-1" type="primary">{{result.tags[1]?result.tags[1]:"sb"}}</badge>
                    <badge class="mt-1 mr-1" type="primary">{{result.tags[2]?result.tags[2]:"sb"}}</badge>
                </div>
            </div>

    </div>
</template>
<script>
import {searchH} from "../../api";
export default {
        props: {
            msg:{}
        },
        data(){
            return{
                results: [],
                showError: false,
                showInfo: false,
                errorMsg: '',
                infoMsg: '',
                BASE_URL:'http://114.116.171.72:8080/'
            }
        },
        methods:{
            getHouseList(){
                this.showError = this.showInfo = false;
                searchH({params:{"kw":this.msg}})
                .then(res => {
                    if(res.data.length>6){
                        this.results = res.data.slice(0,6);
                    }else{
                        this.results = res.data;
                    }
                    console.log(this.results);
                    if (this.results === null || this.results.length === 0){
                        this.showInfo = true;
                        this.infoMsg = '抱歉，未找到对应房源Orz';
                    }
                })
                .catch(err => {
                    this.showError = true;
                    this.errorMsg = err;
                    return false;
                })
            },
            gotoHouse(hid){
                this.$router.push({path:`/house/${hid}`})
            }
        },
        created(){
            this.getHouseList();
        }
}
</script>
